
<template>
  <div class="head">
    <van-nav-bar left-arrow @click-left="go">
      <template #title
        ><router-link to="/reg"
          ><span style="color: #c8c9cc">注册</span></router-link
        >
        /
        <span style="color: #fff">登录</span>
      </template></van-nav-bar
    >
    <van-field
      v-model="username"
      clearable
      left-icon="phone-o"
      placeholder="请输入手机号"
    />
    <van-field
      v-model="password"
      clearable
      left-icon="music-o"
      placeholder="请输入密码"
    />

    <div class="foot">
      <van-button size="normal" type="primary" block @click="loginPost"
        >登录</van-button
      >
    </div>
  </div>
</template>
<script>
// import { getCateList } from "@/api/login";
import { Toast } from "vant";
import { Field } from "vant";
import { Button } from "vant";
export default {
  data() {
    return {
      user: [],
      show: true,
      username: "",
      password: "",
    };
  },
  components: {
    [Field.name]: Field,
    [Button.name]: Button,
  },
  mounted() {},
  methods: {
    go() {
      this.$router.go(-1);
    },
    loginPost() {
      if (this.username == "") {
        Toast({
          message: "手机号不能为空",
          position: "top",
          duration: "3000",
        });
        return;
      } else if (this.password == "") {
        Toast({
          message: "密码不能为空",
          position: "top",
          duration: "3000",
        });
        return;
      }
      this.$http
        .post("/user/login", {
          UserName: this.username,
          Password: this.password,
        })
        .then((res) => {
          console.log(res);
          Toast({
            message: "注册成功！",
            position: "top",
            duration: 3000,
          });
          this.$router.push("page");
        })
        .catch((err) => {
          if (err.response.status == 401) {
            Toast({
              message: "无法访问",
              position: "top",
              duration: 3000,
            });
            return;
          }
          if (err.response.status == 404) {
            Toast({
              message: "网络请求失败，请稍后再试",
              position: "top",
              duration: 3000,
            });
            return;
          }
          console.log(err.response.status);
        });
    },
  },
};
</script>
<style lang="less">
.head {
  .foot {
    margin-top: 26px;
    padding-left: 17px;
  }
}
.van-button--block {
  width: 95%;
}
</style>